<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<!-- 标题 -->
	<title>掌柜</title>
	<!-- 关键词 -->
	<meta name="keywords" content="" />
	<!-- 网站简介 -->
    <meta name="description" content="" />
    <!-- 自适应屏幕 -->
	<meta name="viewport" content="width=device-width,height=device-height,inital-scale=1.0,maximum-scale=1.0,user-scalable=no;">
	<!-- IE兼容 -->
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<!-- 最新 Bootstrap 核心 CSS 文件 -->
	<link rel="stylesheet" href="css/bootstrap.css">
	<!-- 核心 CSS 文件 -->
	<link rel="stylesheet" href="css/style.css" type="text/css">
</head>
<body >
    <!-- Start table-manger -->
    <div class="table-manger">
        <!-- 固定顶部 -->
        <div class="table-manger-top clearfix">
            <div class="left">
                <a href=""></a>
            </div>
            <div class="table-manger">
                桌号管理
            </div>
            <div class="right">
                <input type="button" value="管理" id="st1">
                <input type="button" value="完成" id="st2">
            </div>
        </div>
        <div class="table-manger-edit">
            <div class="table-manger-baoxiang">
                <div class="baoxiang-name">
                    包厢
                </div>
                <div class="item">
                    <input type="text" class="delete1" value="全部删除">
                    <ul class="table-manger-number clearfix">
                        <li>
                            <div class="tab-num">桌1</div>
                            <div class="tab-pad">PAD1</div>
                        </li>
                        <li>
                            <div class="tab-num">桌2</div>
                            <div class="tab-pad">PAD1</div>
                        </li>
                        <li>
                            <div class="tab-num">桌3</div>
                            <div class="tab-pad">PAD1</div>
                        </li>
                        <li>
                            <div class="tab-num">桌4</div>
                            <div class="tab-pad">PAD1</div>
                        </li>
                        <li>
                            <div class="tab-num">桌5</div>
                            <div class="tab-pad">PAD1</div>
                        </li>
                        <li>
                            <div class="tab-num">桌6</div>
                            <div class="tab-pad">PAD1</div>
                        </li>
                        <li>
                            <div class="tab-num">桌7</div>
                            <div class="tab-pad">PAD1</div>
                        </li>
                        <li>
                            <div class="tab-num">桌8</div>
                            <div class="tab-pad">PAD1</div>
                        </li>
                        <li>
                            <div class="tab-num">桌9</div>
                            <div class="tab-pad">PAD1</div>
                        </li>
                        <li>
                            <div class="tab-num">桌10</div>
                            <div class="tab-pad">PAD1</div>
                        </li>
                    </ul>
                </div>
            </div>
            
            <div class="table-manger-dating">
                <div class="baoxiang-name">
                    大厅
                </div>
                <div class="item">
                    <input type="text" class="delete2" value="全部删除">
                    <ul class="table-manger-number clearfix">
                        <li>
                            <div class="tab-num">桌1</div>
                            <div class="tab-pad">PAD1</div>
                        </li>
                        <li>
                            <div class="tab-num">桌2</div>
                            <div class="tab-pad">PAD1</div>
                        </li>
                        <li>
                            <div class="tab-num">桌3</div>
                            <div class="tab-pad">PAD1</div>
                        </li>
                        <li>
                            <div class="tab-num">桌4</div>
                            <div class="tab-pad">PAD1</div>
                        </li>
                        <li>
                            <div class="tab-num">桌5</div>
                            <div class="tab-pad">PAD1</div>
                        </li>
                        <li>
                            <div class="tab-num">桌6</div>
                            <div class="tab-pad">PAD1</div>
                        </li>
                        <li>
                            <div class="tab-num">桌7</div>
                            <div class="tab-pad">PAD1</div>
                        </li>
                        <li>
                            <div class="tab-num">桌8</div>
                            <div class="tab-pad">PAD1</div>
                        </li>
                        <li>
                            <div class="tab-num">桌9</div>
                            <div class="tab-pad">PAD1</div>
                        </li>
                        <li>
                            <div class="tab-num">桌10</div>
                            <div class="tab-pad">PAD1</div>
                        </li>
                    </ul> 
                </div>
            </div>
        </div> 
        <div class="table-manger-add">
            <a href="add-table.html">添加桌子</a>
        </div>
    </div>
    <!-- End table-manger -->
    <!-- jQuery文件 -->
    <script src="js/jquery.min.js"></script>
    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="js/bootstrap.min.js"></script>
    <!-- 全部删除 js-->
    <script src="js/delete.js"></script>
    <script>
        $(document).ready(function(){
            $('.item .delete1').click(function(){
                var elem = $(this).closest('.item');
                $.confirm({
                    'message'   : '确认删除包厢的全部桌子？',
                    'buttons'   : {
                        '确定'   : {
                            'class' : 'blue',
                            'action': function(){
                                elem.slideUp();
                            }
                        },
                        '取消'    : {
                            'action': function(){}  
                        }
                    }
                });
            });
        });
        $(document).ready(function(){
            $('.item .delete2').click(function(){
                var elem = $(this).closest('.item');
                $.confirm({
                    'message'   : '确认删除大厅的全部桌子？',
                    'buttons'   : {
                        '确定'   : {
                            'class' : 'blue',
                            'action': function(){
                                elem.slideUp();
                            }
                        },
                        '取消'    : {
                            'action': function(){}  
                        }
                    }
                });
            });
        });
        $(document).ready(function(){
            $('#st1').click(function(){
                $('.delete1').css("display","block");
                $('.delete2').css("display","block");
                $('#st1').css("display","none");
                $('#st2').css("display","block");
            });
            $('#st2').click(function(){
                $('.delete1').css("display","none");
                $('.delete2').css("display","none");
                $('#st1').css("display","block");
                $('#st2').css("display","none");
            });
        });
    </script>
</body>
</html>